<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2022/5/13
  Time: 16:31
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<html lang="zh">
<head>
<title>LXQ APP Market</title>
<link href="${pageContext.request.contextPath}/css/index.css"
	rel="stylesheet">
</head>
<body>
	<header class="width_middle">
		<h1>LXQ APP Market</h1>
		<div class="search_div" style="display: flex;">
			<form style="margin: auto;" method="get" action="/index">
				<%--<select>
                <option>搜全部</option>
                <option>搜软件</option>
                <option>搜分类</option>
                <option>搜用户</option>
            </select>--%>
				<input class="search_app_input" placeholder="请输入关键字"
					id="search_input" name="search_app">
				<button id="search_app_btn" class="search_app_btn">搜索</button>
			</form>
		</div>
		<div class="user_entrance" style="display: flex; align-items: center;">
			<c:if test="${user_entrance!=null}">
				<c:if test="${user_entrance.userAvatar==null}">
					<img src="${pageContext.request.contextPath}/img/interesting.gif"
						class="user_img" />
				</c:if>
				<c:if test="${user_entrance.userAvatar!=null}">
					<img
						src="${pageContext.request.contextPath}${user_entrance.userAvatar}"
						class="user_img" />
				</c:if>
            &nbsp;&nbsp;&nbsp;&nbsp;
            <c:if test="${admin==1}">
					<a href="${pageContext.request.contextPath}/admin/index">${user_entrance.userName}</a>
				</c:if>
				<c:if test="${admin!=1}">
					<a href="${pageContext.request.contextPath}/user/index">${user_entrance.userName}</a>
				</c:if>
			</c:if>

			<c:if test="${user_entrance==null}">
				<img src="${pageContext.request.contextPath}/img/android.png"
					class="user_img" />&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="${pageContext.request.contextPath}/login.jsp">登录||注册</a>
			</c:if>
		</div>
	</header>
	<nav class="width_middle">
		<ul class="category_list">
		<c:if test="${current_category=='全部' }">
			<li class="active"><a href="${pageContext.request.contextPath}/index">全部</a></li>
		</c:if>
		<c:if test="${current_category!='全部' }">
			<li><a href="${pageContext.request.contextPath}/index">全部</a></li>
		</c:if>
			<c:forEach items="${category}" var="name">
				<c:if test="${name== current_category}">
					<li class="active"><a href="${pageContext.request.contextPath}/index?app_category=${name}">${name}</a></li>
				</c:if>
				<c:if test="${name!= current_category}">
					<li><a href="${pageContext.request.contextPath}/index?app_category=${name}">${name}</a></li>
				</c:if>
			</c:forEach>
		</ul>
	</nav>
	<main class="width_middle" id="main">
		<ul class="app_list">
			<c:forEach items="${appList}" var="app">
			<li class="app_item"><img
				src="${pageContext.request.contextPath}${app.appLogo}">
				<h2>${app.appName}</h2></li></c:forEach>
		</ul>
		<div class="app_info" id="app_info">
			<div style="display: flex; width: 100%">
				<img class="app_logo"
					:src="${pageContext.request.contextPath}appLogo">&nbsp;&nbsp;&nbsp;&nbsp;
				<div style="width: 100%">
					<div
						style="position: absolute; top: 0px; right: 0px; padding: 10px; display: flex;">
						<a
							style="font-size: 16px; text-decoration: none; background-color: #00acee; 
							margin-right: 20px; line-height: 40px; padding: 0 10px; color: white;"
							:href="${pageContext.request.contextPath}appFile">下载: {{appSize}} MB</a> <span id="close_app_info"
							style="color: white; background-color: red; display: block; height: 40px; 
							line-height: 40px; padding: 0 10px; cursor: pointer;" onclick="closeAppInfoFrame()">关闭</span>
					</div>

					<h4>app 名: {{appName}}</h4>
					<%-- <span>五星好评</span>--%>
					<p style="margin: 10px 0">app分类：{{appCategory}}</p>
					<p style="font-size: 14px">app介绍：{{appDesc}}</p>
					<%--<p>下载量：</p> --%>
				</div>
			</div>
			<%--<div class="app_lab">
				<div class="tab_active tab_item">应用信息</div>
				<div class="tab_item">应用评价</div>
			</div>--%>
			<%--        ============--%>
			<div class="app_detail">
				<div style="overflow: auto; width: 100%; margin-bottom: 20px;">
					<ul class="app_shot_img">
						<li v-for="img in appShot"><img style="width: 100%;height:100%;" alt=""
							:src="${pageContext.request.contextPath}img"></li>

					</ul>
				</div>
				<p>上传用户：{{appFrom}}</p>
			</div>
			<ul class="app_comment">
				<li><img class="user_avatar"
					src="${pageContext.request.contextPath}/img/k_logo.jpg">
					<div>
						<p class="user_name">用户名</p>
						<p class="user_comment">用户评价</p>
						<small class="comment_date">2022年5月13日</small>
					</div></li>
			</ul>
		</div>
	</main>
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/vue.min.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/index.js"></script>
</body>
</html>
